<!DOCTYPE html>
<html style="height:100%">
<head>
<meta charset="UTF-8">
<title>庭审直播</title>
<link rel="stylesheet" type="text/css" href="@{'/public/stylesheets/easyui/easyui.css'}">
<link rel="stylesheet" type="text/css" href="@{'/public/stylesheets/easyui/color.css'}">
<link rel="stylesheet" type="text/css" href="@{'/public/stylesheets/easyui/icon.css'}">
<link rel="stylesheet" type="text/css" href="@{'/public/stylesheets/form.css'}">
<link rel="stylesheet" type="text/css" href="@{'/public/javascripts/layout/themes/default/css/ueditor.min.css'}">
<link rel="stylesheet" type="text/css" href="@{'/public/stylesheets/jplayer/jplayer.blue.monday.css'}">
</head>
<style>
	.titleli{
		border-bottom:1px solid #ccc;
		width:100%;
		text-decoration:none;
		line-height:30px;
		background-color:rgb(250, 250, 250);
		list-style:none;
		color:#6197cc !important;
		float:left;
	}
	.titlespan{
		font-size:12px;
		margin-left:10px;
		cursor:pointer;
		-moz-user-select:none;
	}
	.titleimg{
		float:right;
		margin-top:10px;
		margin-right:10px;
		cursor:pointer;
	}
	a{
		text-decoration:none;
		color:#6197cc;
	}
	ul{
		-webkit-padding-start: 0px;
		-moz-padding-start: 0px;
		padding:0px;
		margin:0px;
	}
	.active{
		background-color: #eceeed !important
	}
	.textarecss{
		background-color:rgb(250, 250, 250)
	}
	.textarecssword{
		background-color:rgb(250, 250, 250);
		/* border-width: 0px; */
	}
	.openMouseClass{
		cursor:pointer;
	}
	.colseMouseClass{
		cursor:not-allowed;
		color:#ffffff;
	}
</style>
<body class="zitifont">
<form action="@{CourtLiveController.courtExportWord}" method="post" id="exportCourt" >
	<input type="hidden" name="caseid" id="exportCaseid" value="${caseid}" />
	<input type="hidden" name="authenticityToken" id="authenticityToken" />
	<textarea id="exportHtml" name="html" style="display: none;" ></textarea>
</form>
	<div class="col-xs-12 topcase">
		<div class="col-xs-8" style="float:left;margin-left:50px">
			<div class="col-xs-6">
				<span class="word">开庭时间:</span>
				<span class="word" style="width:60%;text-align:left;padding-left:10px">${cases?.opendate?.format('yyyy年MM月dd日')}</span>
				
			</div>
			<div class="col-xs-6">
				<span class="word">开庭地点:</span>
				<span class="word" style="width:60%;text-align:left;padding-left:10px">${cases?.opencourt}</span>
			</div>
			<div class="col-xs-6" style="margin-top:5px">
				<span class="word">案件编号:</span>
				<span class="word" style="width:60%;text-align:left;padding-left:10px">${cases?.casecode}</span>
			</div>
			<div class="col-xs-6" style="margin-top:5px">
				<span class="word">案件名称:</span>
				<span class="word" style="width:60%;text-align:left;padding-left:10px">${cases?.casename}</span>
			</div>
		</div>
	</div>
	<div class="col-xs-12">
		<input type="hidden" id="courtid" value="${courtid}">
		<input type="hidden" id="caseid" value="${caseid}">
		<div class="col-xs-9" style="min-height:400px">
			<div class="col-xs-11" style="padding-left:50px;margin-top:10px">
				<div class="col-xs-12 topcontrol">
					<span style="font-size:18px;color:#6197cc">庭审笔录</span>
					<div style="width:150px;float:right;text-align:right;margin-right:10px">
						<img src="@{'/public/images/icon_sysn.png'}" style="margin-left:15px;cursor:pointer;" onclick="saveCourt()" >
						<img src="@{'/public/images/icon_export.png'}" style="margin-left:15px;cursor:pointer;" onclick="exportCourt()">
						<img src="@{'/public/images/icon_print.png'}" style="margin-left:15px;cursor:pointer;" onclick="printCourt()">
					</div>
				</div>	
				<div class="col-xs-12" style="margin-top:10px">
					<div class="col-xs-12">
						<script type="text/plain" id="myEditor" style="width:99%;min-height:200px"></script>
					</div>
				</div>
				<div class="col-xs-12 footerPlayer" style="margin-top:10px">
					<div id="jplayer" class="jp-jplayer" ></div>
					<div id="jp_container_1" class="jp-audio" style="width:98% !important">
						<div class="jp-type-single">
							<div class="jp-gui jp-interface">
								<div class="jp-controls">
									<button class="jp-play" role="button" tabindex="0">play</button>
									<button class="jp-stop" role="button" tabindex="0">stop</button>
								</div>
								<div class="jp-progress">
									<div class="jp-seek-bar">
										<div class="jp-play-bar"></div>
									</div>
								</div>
								<div class="jp-volume-controls">
									<button class="jp-mute" role="button" tabindex="0">mute</button>
									<button class="jp-volume-max" role="button" tabindex="0">max volume</button>
									<div class="jp-volume-bar">
										<div class="jp-volume-bar-value"></div>
									</div>
								</div>
								<div class="jp-time-holder">
									<div class="jp-current-time" role="timer" aria-label="time">&nbsp;</div>
									<div class="jp-duration" role="timer" aria-label="duration">&nbsp;</div>
								</div>
							</div>
							<div class="jp-no-solution">
								<span>Update Required</span>
								To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="col-xs-3" style="min-height:200px;margin-top:10px">
			<div class="col-xs-12">
					<span class="col-xs-12" style="font-size:18px;width:120px;color:#6197cc;margin-top:15px">词条修正</span>
					<div class="col-xs-11 citiao" style="border:1px solid #D4D4D4;height:200px;overflow:auto;margin-top:10px;" >
						<ul class="shaixuan" >
							#{list items:words,as:"word"}
									<li class="titleli " >
										<span class="titlespan" onselectstart="return false;" ondblclick="changeContent('${word?.context}','${word?.casewordid}')">${word?.context}</span>
										<img src="@{'/public/images/icon_delete.png'}" class="titleimg" onclick="delkeyword('${word?.casewordid}')">
									</li>
							#{/list}
						</ul>
					</div>
					<div class="col-xs-11" style="margin-top:10px;" >
						<textarea  class="textarecssword" id="content" style="width:99.6%;font-size:16px;min-height:80px;resize:none;" placeholder="请输入个性化词汇"></textarea>
					</div>
					<div class="col-xs-11" >
						<img src="@{'/public/images/button_add_small.png'}" style="margin-top:5px;float:right;cursor:pointer;" onclick="addWord()">
						<!-- <span style="float:left;color:#6197cc;font-size:18px">模糊查找</span> -->
					</div>
					
					<div class="col-xs-11" style="min-height:100px;margin-top:10px;" >
						
					</div>
			</div>
		</div>
	</div>
</body>
<script type="text/javascript" src="@{'/public/javascripts/layout/jquery-1.8.2.js'}"></script>
<script type="text/javascript" src="@{'/public/javascripts/layout/jquery.easyui.min.js'}"></script>
<script type="text/javascript" src="@{'/public/javascripts/layout/easyui-lang-zh_CN.js'}"></script>
<script type="text/javascript" src="@{'/public/javascripts/layout/Validator.js'}"></script>
<script type="text/javascript" src="@{'/public/javascripts/layout/common.js'}"></script>
<script type="text/javascript" src="@{'/public/javascripts/layout/dateFormat.js'}"></script>
<script type="text/javascript" src="@{'/public/javascripts/layout/ueditor.config.js'}"></script>
<script type="text/javascript" src="@{'/public/javascripts/layout/ueditor.all.js'}"></script>
<script type="text/javascript" src="@{'/public/javascripts/layout/ueditor.parse.min.js'}"></script>
<script type="text/javascript" src="@{'/public/javascripts/layout/jquery.jplayer.js'}"></script>
<script type="text/javascript" src="@{'/public/javascripts/layout/jquery.cookie.js'}"></script>
<script type="text/javascript">
	var $Path='${ctxPath}';
	
	var centerHeight=window.parent.getCenterHeight()-$(".topcase").height()
				-$(".topcontrol").height()-50-$(".footerPlayer").height()*2-$("#edui1_toolbarbox").height();
	$("#myEditor").css("height",centerHeight);
	$(".citiao").css("height",centerHeight-30);

	//ue.setContent('${content}');
	var ue=UE.getEditor('myEditor',{
					toolbars:[['fullscreen','source','bold','fontfamily','fontsize','italic','underline', 'fontborder', 
					           'justifyleft','searchreplace', 'justifycenter', 'justifyright', 'justifyjustify','forecolor', 'backcolor','rowspacingtop', 'rowspacingbottom', 'lineheight']],
					 enableContextMenu:false,
					 enableAutoSave:false,
//					  initialContent:content,
					 initialStyle:'body{font-size:18px;background-color:#e7e7e7;font-family:FangSong}'
				});
	var status='${status}';
	var length='${length}';
	var player;
	$(function(){
		
		$Path='${ctxPath}';
		var videoUrl=$Path+'${cases?.videopath}';
		player=$("#jplayer").jPlayer({
			swfPath:$Path+"/public/javascripts/flash/jquery.jplayer.swf",
			solution: "flash",
			supplied: "mp3",
			useStateClassSkin: true,
			autoBlur: false,
			smoothPlayBar: true,
			remainingDuration: false,
			toggleDuration: false,
			timeFormat:{
				showHour:true,
				sepHour:":",
				sepMin:":"
			},
			ready:function(){
				var containerLength=$("#jp_container_1").width();
				$(".jp-progress").width(containerLength-220);
				$(".jp-time-holder").width(containerLength-220);
				$("#jplayer").jPlayer("setMedia", {
					mp3:videoUrl
				});
				$("#jplayer").jPlayer("play");
			}
		});
	})
</script>
<script type="text/javascript" src="@{'/public/javascripts/DemandController/replay.js'}"></script>
</html>